import { CodeBlock } from '@theme';
import webpackDiff from '../../public/diffs/repack_v1-v2.diff?raw';

# Re.Pack 1.x to 2.x

This guide shows how to upgrade from `@callstack/nativepack@1.x` to `@callstack/repack@2.x`.

:::info

`@callstack/repack` is rebranded `@callstack/nativepack` - they are both the same project.

:::

## Dependencies

First, you need to update dependencies and replace `@callstack/nativepack` with `@callstack/repack` in your project's `package.json`:

```diff
- "@callstack/nativepack": "^1.4.2"
+ "@callstack/repack": "^2.0.0"
```

:::tip

It's also recommended to update Webpack to the latest version. In case of any trouble, take a look at [Compatibility with Webpack table](../getting-started#compatibility-with-webpack).

:::

After updating dependencies, please run:

```bash
npm install
# or
yarn install
```

## Webpack config

Every project is different and we have no way of knowing what your Webpack config looks like, so we cannot
pin point every possible change you might need to do. Instead we provide a diff of our
[Webpack config template](https://github.com/callstack/repack/blob/main/templates/webpack.config.js),
which you can use as a base to figure out what you need to change.

Below is the diff of `template/webpack.config.js` between Re.Pack 1.x and 2.x:

<CodeBlock language="diff">{webpackDiff}</CodeBlock>

:::tip

After applying these changes to your Webpack config, try bundling your application or running it.

:::

If you have build errors try adjusting Webpack config based on what the errors are saying. After addressing build errors, you should be able to run the application.

:::caution

If you are facing runtime errors or crashes, please open an issue!

:::
